﻿@{
    ViewBag.Title = "Window : Set Height, Width, and Title";
}

<h2>Window : Set Height, Width, and Title</h2>

<div style="height:300px;"">
    <button id="showWindowButton" onclick="showWindow()" style="display:none;">Show Window</button>
@{
    Html.Telerik().Window()
        .Name("SampleWindow")
        .Title("Sample Window")
        .Content(
            @<text>
            <div style="margin-bottom:10px;">
            Current Height: <span id="currentHeight">250</span><br />
            Current Width: <span id="currentWidth">500</span><br />
            Current Width: <span id="currentTitle">Sample Window</span>
            </div>
            <div style="margin-bottom:10px;">
            New Height: @Html.TextBox("newHeightTextBox") <button onclick="newHeight()">Apply</button>
            </div>
            <div style="margin-bottom:10px;">
            New Width: @Html.TextBox("newWidthTextBox") <button onclick="newWidth()">Apply</button>
            </div>
            <div style="margin-bottom:10px;">
            New Title: @Html.TextBox("newTitleTextBox") <button onclick="newTitle()">Apply</button>
            </div>
            </text>
        )
        .Width(500)
        .Height(250)
        .ClientEvents(events => events.OnClose("SampleWindow_onClose"))
        .Render();
}
</div>

<script type="text/javascript">
    newHeight = function () {
        var height = parseInt($('#newHeightTextBox').val());

        if (isNaN(height) == false) {
            $('#SampleWindow').data('tWindow').setHeight(height);
            $('#currentHeight').text(height);
        }
    }
    newWidth = function () {
        var width = parseInt($('#newWidthTextBox').val());

        if (isNaN(width) == false) {
            $('#SampleWindow').data('tWindow').setWidth(width);
            $('#currentWidth').text(width);
        }
    }
    newTitle = function () {
        var title = $('#newTitleTextBox').val();

        if (title.length > 0) {
            $('#SampleWindow').data('tWindow').setTitle(title);
            $('#currentTitle').text(title);
        }
    }
    SampleWindow_onClose = function (e) {
        $('#showWindowButton').css('display', '');
    }
    showWindow = function () {
        $('#showWindowButton').css('display', 'none');
        $('#SampleWindow').data('tWindow').open();
    }
</script>